import React, {useState, useEffect} from 'react';
import {connect} from 'react-redux';
import {addUser, deleteUser, fetchTest} from '../store/actions/userAction';
function Test(props) {
    const {
        addUser,
        item,
        deleteUser,
        fetchTest
    } = props;
    useEffect(() => {

    });
    const test = () => {
        addUser({name: "李四",age: 20})
    }
    const test1 = () => {
        fetchTest({name: "李四",age: 20})
    }
    return (
        <div>
            <h1>组件1</h1>
            <div>{item?.map((v,i)=>{
                return <p key={i}>姓名:{v.name}年龄:{v.age}</p>
            })}</div>
            <button onClick={() => test()}>
                增加
            </button>
            <button onClick={() => test1()}>
                异步增加
            </button>
        </div>
    );
}

const mapStateToProps = (state) => {
    console.log(state)
    return {
        item: state.user.item
    }
}

const mapDispatchToProps = (dispatch) => {
    return {
        // addUser, deleteUser, fetchTest
        addUser(data){
            dispatch(addUser(data));
        },
        deleteUser(){
            dispatch(deleteUser());
        },
        fetchTest(data){
            dispatch(fetchTest(data));
        }
    }
}
export default connect(mapStateToProps, mapDispatchToProps)(Test);